<?php

/* @var $this yii\web\View */
/* @var $form yii\bootstrap\ActiveForm */
/* @var $model app\models\SignupForm */

use yii\helpers\Html;
use yii\bootstrap\ActiveForm;

$this->title = '账号申请';
$this->params['breadcrumbs'][] = $this->title;


?>
    <div class="site-signup">
        <h1><?= Html::encode($this->title) ?></h1>

        <p>请填写以下信息完成注册:</p>

        <div class="row">
            <div class="col-lg-5">
                <?php $form = ActiveForm::begin(['id' => 'form-signup','options' => ['enctype' => 'multipart/form-data']]); ?>

                <?= $form->field($model,'type')->dropDownList(['1'=>'公司管理员','2'=>'园区管理员'],['prompt' => '选择所属公司','id'=>'type_sel'])->label('账号类型')?>

                <?= $form->field($model, 'company_id')->dropdownlist(
                    \app\models\Company::find()->select(['name'])->indexBy('id')->column(),
                    [
                        'prompt' => '选择所属公司',
                        'onchange'=>'
                            $.post("index.php?r=site/parklist&id='.'"+$(this).val(),function(data){
                                $("select#signupform-park_id").html(data);
                            });',

                    ]);?>
                <?= $form->field($model, 'park_id')->dropDownList(
                    \app\models\Park::find()->select(['name'])->indexBy('id')->column(),
                    [
                        'prompt'=>'-',
                    ]
                ) ?>

                <?= $form->field($model, 'name')->label('姓名') ?>

                <?= $form->field($model, 'identity_card')->label('身份证号') ?>

                <?= $form->field($model,'idcard_img')->hiddenInput(['id'=>'idcard_img_input'])->label(false)?>

                <?= $form->field($model,'cachet_img')->hiddenInput(['id'=>'cachet_img_input'])->label(false)?>

                <?= Html::label('身份证照片')?><br>
                <?= Html::img('/shbb/web/images/nopic.png',['style'=>'width:300px;height:250px;','id'=>'idcard-img'])?><br>
                <a href='javascript:;' class="upload" id="idcard-upload-btn">上传</a><br>
                <div style="display:none"><input type="file" id="idcard-upload-input" name="UploadForm[file]" /></div>

                <?= Html::label('公章照片')?><br>
                <?= Html::img('/shbb/web/images/nopic.png',['style'=>'width:200px;height:200px;','id'=>'cachet-img'])?><br>
                <a href='javascript:;' class="upload" id="cachet-upload-btn">上传</a><br>
                <div style="display:none"><input type="file" id="cachet-upload-input" name="UploadForm[file]" /></div>

               <!-- --><?/*= $form->field($model, 'imageFile')->fileInput() */?>


                <?/*= $form->field($model, 'imageFile2')->fileInput() */?>





                <div class="form-group">
                    <?= Html::submitButton('注册', ['class' => 'btn btn-primary', 'name' => 'signup-button','style'=>'margin-top:10px;']) ?>
                </div>

                <?php ActiveForm::end(); ?>

            </div>
        </div>
    </div>
<div id="test"></div>
<?php


$js = <<<JS

    $(function(){

        $(".field-signupform-park_id").hide();
        $('#type_sel').change(function(){
            var type = $(this).find('option:selected').val();
            if(type==2){
                $('.field-signupform-park_id').show();
            }else{
                $('.field-signupform-park_id').hide();
            }
        })

        jQuery.extend({

                createUploadIframe: function(id, uri)
                {
                        //create frame
                        var frameId = 'jUploadFrame' + id;

                        if(window.ActiveXObject) {
                            var io = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />');
                            if(typeof uri== 'boolean'){
                                io.src = 'javascript:false';
                            }
                            else if(typeof uri== 'string'){
                                io.src = uri;
                            }
                        }
                        else {
                            var io = document.createElement('iframe');
                            io.id = frameId;
                            io.name = frameId;
                        }
                        io.style.position = 'absolute';
                        io.style.top = '-1000px';
                        io.style.left = '-1000px';

                        document.body.appendChild(io);

                        return io
                },
                createUploadForm: function(id, fileElementId)
                {
                    //create form
                    var formId = 'jUploadForm' + id;
                    var fileId = 'jUploadFile' + id;
                    var form = $('<form  action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data"></form>');
                    var oldElement = $('#' + fileElementId);
                    var newElement = $(oldElement).clone();
                    $(oldElement).attr('id', fileId);
                    $(oldElement).before(newElement);
                    $(oldElement).appendTo(form);

                    //set attributes
                    $(form).css('position', 'absolute');
                    $(form).css('top', '-1200px');
                    $(form).css('left', '-1200px');
                    $(form).appendTo('body');
                    return form;
                },

                ajaxFileUpload: function(s) {
                    // TODO introduce global settings, allowing the client to modify them for all requests, not only timeout
                    s = jQuery.extend({}, jQuery.ajaxSettings, s);
                    var id = s.fileElementId;
                    var form = jQuery.createUploadForm(id, s.fileElementId);
                    var io = jQuery.createUploadIframe(id, s.secureuri);
                    var frameId = 'jUploadFrame' + id;
                    var formId = 'jUploadForm' + id;
                    // Watch for a new set of requests
                    if ( s.global && ! jQuery.active++ )
                    {
                        jQuery.event.trigger( "ajaxStart" );
                    }
                    var requestDone = false;
                    // Create the request object
                    var xml = {}
                    if ( s.global )
                        jQuery.event.trigger("ajaxSend", [xml, s]);
                    // Wait for a response to come back
                    var uploadCallback = function(isTimeout)
                    {
                        var io = document.getElementById(frameId);
                        try
                        {
                            if(io.contentWindow)
                            {
                                 xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
                                 xml.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;

                            }else if(io.contentDocument)
                            {
                                 xml.responseText = io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null;
                                xml.responseXML = io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document;
                            }
                        }catch(e)
                        {
                            jQuery.handleError(s, xml, null, e);
                        }
                        if ( xml || isTimeout == "timeout")
                        {
                            requestDone = true;
                            var status;
                            try {
                                status = isTimeout != "timeout" ? "success" : "error";
                                // Make sure that the request was successful or notmodified
                                if ( status != "error" )
                                {
                                    // process the data (runs the xml through httpData regardless of callback)
                                    var data = jQuery.uploadHttpData( xml, s.dataType );
                                    // If a local callback was specified, fire it and pass it the data
                                    if ( s.success )
                                        s.success( data, status );

                                    // Fire the global callback
                                    if( s.global )
                                        jQuery.event.trigger( "ajaxSuccess", [xml, s] );
                                } else
                                    jQuery.handleError(s, xml, status);
                            } catch(e)
                            {
                                status = "error";
                                jQuery.handleError(s, xml, status, e);
                            }

                            // The request was completed
                            if( s.global )
                                jQuery.event.trigger( "ajaxComplete", [xml, s] );

                            // Handle the global AJAX counter
                            if ( s.global && ! --jQuery.active )
                                jQuery.event.trigger( "ajaxStop" );

                            // Process result
                            if ( s.complete )
                                s.complete(xml, status);

                            jQuery(io).unbind()

                            setTimeout(function()
                                                {	try
                                                    {
                                                        $(io).remove();
                                                        $(form).remove();

                                                    } catch(e)
                                                    {
                                                        jQuery.handleError(s, xml, null, e);
                                                    }

                                                }, 100)

                            xml = null

                        }
                    }
                    // Timeout checker
                    if ( s.timeout > 0 )
                    {
                        setTimeout(function(){
                            // Check to see if the request is still happening
                            if( !requestDone ) uploadCallback( "timeout" );
                        }, s.timeout);
                    }
                    try
                    {
                       // var io = $('#' + frameId);
                        var form = $('#' + formId);
                        $(form).attr('action', s.url);
                        $(form).attr('method', 'POST');
                        $(form).attr('target', frameId);
                        if(form.encoding)
                        {
                            form.encoding = 'multipart/form-data';
                        }
                        else
                        {
                            form.enctype = 'multipart/form-data';
                        }
                        $(form).submit();

                    } catch(e)
                    {
                        jQuery.handleError(s, xml, null, e);
                    }
                    if(window.attachEvent){
                        document.getElementById(frameId).attachEvent('onload', uploadCallback);
                    }
                    else{
                        document.getElementById(frameId).addEventListener('load', uploadCallback, false);
                    }
                    return {abort: function () {}};

                },

                uploadHttpData: function( r, type ) {
                    var data = !type;
                    data = type == "xml" || data ? r.responseXML : r.responseText;
                    // If the type is "script", eval it in global context
                    if ( type == "script" )
                        jQuery.globalEval( data );
                    // Get the JavaScript object, if JSON is used.
                    if ( type == "json" )
                        eval( "data = " + data );
                    // evaluate scripts within html
                    if ( type == "html" )
                        jQuery("<div>").html(data).evalScripts();
                        //alert($('param', data).each(function(){alert($(this).attr('value'));}));
                    return data;
                }
            })


          $("input#idcard-upload-input").change(function () {
                idcardUpload();

            });
            $("#idcard-upload-btn").click(function(){
                $("input#idcard-upload-input").click();
            });

            $("input#cachet-upload-input").change(function () {
                var id =1;
                $.ajaxFileUpload({
                    url: 'index.php?r=site/uploadimg',
                    secureuri: false,
                    data:{
                        'id':id
                    },
                    fileElementId:'cachet-upload-input',
                    dataType: 'json',
                    success: function (data, status) {
                        if(data.result=="Success"){
                            $("#cachet-img").attr('src',data.url);
                            $("#cachet_img_input").val(data.url);
                        }

                    },
                    error: function (data, status, e) {
                    alert("error")
                        return;
                    }
                });
            });
            $("#cachet-upload-btn").click(function(){
                $("input#cachet-upload-input").click();
            });




    });
    function idcardUpload(){
                var id =1;
                $.ajaxFileUpload({
                    url: 'index.php?r=site/uploadimg',
                    secureuri: false,
                    data:{
                        'id':id
                    },
                    fileElementId:'idcard-upload-input',
                    dataType: 'json',
                    success: function (data, status) {
                        /*alert(data.url);
                        $("input#idcard-upload-input").replaceWith($("input#idcard-upload-input").clone(false));
                        $("input#idcard-upload-input").change(function(){
                            idcardUpload();
                        })*/
                        if(data.result=="Success"){
                            $("#idcard-img").attr('src',data.url);
                            $("#idcard_img_input").val(data.url);
                        }else{
                            alert("文件上传出错:"+data.result);
                        }

                    },
                    error: function (data, status, e) {
                        alert("非法访问!");
                    }
                });
    }
JS;
$this->registerJs($js);